<template>
  <el-input
    v-model="input1"
    class="w-50 m-2 input-search"
    @input="onSearch('change')"
    debounce="1000"
    @keyup.enter.stop="onSearch('enter')"
    placeholder="请输入关键字搜索"
    clearable
  >
    <template #append>
      <el-icon @click="onSearch('search')" color="#4E5969">
        <Search />
      </el-icon>
    </template>
  </el-input>
</template>
<script setup>
import { ref, defineEmits, defineProps, watch } from "vue";
import { bounce } from "@/utils/index.js";
const props = defineProps({
  inputText: {
    type: [String, Number],
    required: false,
    defalut: "",
  },
});
const input1 = ref();

const em = defineEmits(["search"]);
const onSearch = bounce((type) => {
  em("search", input1, type);
}, 500);
watch(
  () => props.inputText,
  (newValue) => {
    input1.value = newValue;
  }
);
</script>